import React, {Component} from 'react'
import {connect} from 'react-redux'
import {Link} from 'react-router-dom'

import Header from "../components/header";
import {loadNewItem} from "../redux/actions/findAction"
import {format} from "../utils/datetime"

class NewsItemContainer extends Component {
  constructor (props){
   super(props)
   this.state= {
    newsItem:{}
   }
}
  componentDidMount(){
    const {dispatch,match} = this.props
    dispatch(loadNewItem(match.params.key,(data)=>{
      this.setState({
        newsItem:data.object
      })
    }))
  }

   render() {
     const {newsItem} = this.state
   return <div className="new">
         <Header title="新闻" {...this.props}></Header>
        <div className="newitem">
            <div className="newitemhead">
              <h1>{newsItem.title}</h1>
              <p>{format(newsItem.dateandtime)}</p>
            </div>
            <div className="newitembody">
            <div dangerouslySetInnerHTML={{__html: newsItem.content}}></div>
            </div>
        </div>

   </div>
   }
}

function mapStateToProps(state) {
  return {
    find: state.find
  }
}

export default connect(mapStateToProps)(NewsItemContainer)